<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>个人体检</title>
</head>
<body>
<style type="text/css">
.exItem .text-css{
	border: 0px;
    text-align: center;
    outline: none;
    font-style: italic;
    color:black;
}
</style>
<script type="text/javascript">
$(function(){
	$("input[name='totalCostText']").val("0.00");
 
	//文本框验证
	$.extend($.fn.validatebox.defaults.rules, {    
	    phoneNum: { //验证手机号   
            validator: function(value, param){ 
            	return /^1[34578]\d{9}$/.test(value);
            },    
            message: '请输入正确的手机号码' 
	    },
	    cidNum: {//验证身份证号   
	    	validator: function(value, param){ 
            	return /(^\d{15}$)|(^\d{18}$)|(^\d{17}(\d|X|x)$)/.test(value);
            },    
            message: '请输入正确的身份证号' 
	    },
	   isNull: {
			validator: function(value, param){ 
				if($.trim(value)==""){
					return false;
				}
           		return true;
            }, 
		    message: '请输入非空白字符' 
	   } 
	});
	
	
	//要体检的项目表格
	$("#itemTable").datagrid({
		columns:[[
				{field:'examine_item_number',title:'序 号',width:100,halign:'center'},
				{field:'examine_item_id',hidden:true},
				{field:'type',hidden:true},
				{field:'examine_item_name',title:'项 目 名 称',width:500,halign:'center'},
				{field:'examine_item_price',title:'单 价',width:200,halign:'center',
					formatter:function(value,row,index){
    					return "￥"+value.toFixed(2);
					}
				},
				{field:'handle',title:'操 作',width:140,align:'center'}
		]],
		onClickRow: function (rowIndex, rowData) {
        	$(this).datagrid('unselectRow', rowIndex);
 	 	}
	});
	
	//单项体检表格
	$("#singleTable").datagrid({
		columns:[[
			{field:'examine_item_id',title:'项目编号',width:100,halign:'center'},
			{field:'examine_item_name',title:'项目名称',width:240,halign:'center'},
			{field:'examine_item_price',title:'单价',width:100,halign:'center',
				formatter:function(value,row,index){
					return "￥" + value.toFixed(2);
				}	
			}
		]]
	});
	
	//单项体检搜索框
	$("#opsNameSear").searchbox({
		searcher:function(value){
			$("#singleTable").datagrid({
				url:"ljw-examine?ex="+value
			});
		}
	});
	
	//单项体检按钮
	$("#singleBtn").click(function(){
		$(".singleWin").window("open");
		$("#singleTable").datagrid({
			url:"ljw-examine",
			onDblClickRow:function(index, row){
				var items = $("#itemTable").datagrid("getRows");
				var opin = true;//用于判断是否重复
				for (var i = 0; i < items.length; i++) {
					if(row.examine_item_id==items[i].examine_item_id){
						opin = false;
					}
				}
				if(opin){
					$("#itemTable").datagrid("appendRow",{
						examine_item_number : items.length+1,
						examine_item_id : row.examine_item_id,
						examine_item_name : row.examine_item_name,
						examine_item_price : row.examine_item_price,
						handle : "<a class='del' onclick=''>删除</a>"
					});
				};
				refresh(items);//重新计算
				$(".singleWin").window("close");
			}
		});
	});
	
	//单项体检弹框的添加按钮
	$("#addItem").click(function(){
		var rows = $("#singleTable").datagrid("getSelections");
		addItem(rows);
		$(".singleWin").window("close");
	});
	
	//套餐取消按钮
	$("#comboCancel").click(function(){
		$(".comboWin").window("close");
	});
	
	//套餐添加按钮
	$("#comboAdd").click(function(){
		var row = $("#comboTable").datagrid("getSelected");
		if(row == null){
			return;
		}
		$.post('ljw-combo-details',
			{"cid":row.combo_id},
			function(data){
				addItem(data);
				$("input[name='comboText']").val(row.combo_name);
				$("input[name='comboPriceText']").val(row.combcidNumo_price.toFixed(2));
				$("input[name='combo_id']").val(row.combo_id);
			}
		);
		$(".comboWin").window("close");
	});
	
	//体检套餐按钮
	$("#comboBtn").click(function(){
		$(".comboWin").window("open");
		$("#comboTable").datagrid({
			singleSelect:true,
			url:'ljw-combo',
			onDblClickRow:function(index, row){
				$.post('ljw-combo-details',
					{"cid":row.combo_id},
					function(data){
						addItem(data);
						$("input[name='comboText']").val(row.combo_name);
						$("input[name='comboPriceText']").val(row.combo_price.toFixed(2));
						$("input[name='combo_id']").val(row.combo_id);
					}
				);
				$(".comboWin").window("close");
			}
		});
	});
	
	//登记按钮
	$("#exOkBtn").click(function(){
		var rows = $("#itemTable").datagrid("getRows");
		if(rows.length == 0){
			return ;
		}
		$("#exForm").form({
			url:'ljw-examine-register',
			onSubmit:function(param){
				var comboId = $("input[name='combo_id']").val();
				var rows = $("#itemTable").datagrid("getRows");
				if($.trim(comboId)!=""){
					param["combo.comboId"] = comboId;
				}
				for (var i = 0; i < rows.length; i++) {
					var row = rows[i];
					console.log("id=="+row.examine_item_id);
					param["items["+i+"].examineItemId"] = row.examine_item_id;
				}
				return $(this).form('enableValidation').form('validate');
			},
			success:function(data){
				if(data){
					alert("登记成功");
				}else{
					alert("登记失败！");
				}
			}
		}).submit();
	});
});

//删除行
function del(index,obj){
	var rows = $("#itemTable").datagrid("getRows");
	console.log(rows[index].examine_item_id);
	$.post('ljw-combo-details',
		{"cid":$("input[name='combo_id']").val()},
		function(data){
			console.log(data);
			var opin = false;
			for (var i = 0; i < data.length; i++) {
				var row = data[i];
				if(row.examine_item_id==rows[index].examine_item_id){
					opin = true ;
				}
			}
			if(opin&&$("input[name='combo_id']").val()!=""){
				$.messager.confirm(
					"操作提示", 
					"删除此项目将取消选中的套餐", 
					function (data) {
						if(data) {
							$("input[name='comboText']").val('');
							$("input[name='comboPriceText']").val('');
							$("input[name='combo_id']").val('');
							$("#itemTable").datagrid("deleteRow",index);
							refresh(rows); 
						} 					
					}
				);	
			}else{
				$("#itemTable").datagrid("deleteRow",index)
			};
			refresh(rows);//重新计算 
		}
	); 
}

//体检项目添加到表格
function addItem(rows){
	var items = $("#itemTable").datagrid("getRows");
	if(rows.length==0){
		return;
	}
	for (var i = 0; i < rows.length; i++) {
		var row = rows[i];
		var opin = true;
		for (var k = 0; k < items.length; k++) {
			if(row.examine_item_id==items[k].examine_item_id){
				row.type = "combo";
				opin = false;
			}
		}
		if(opin){
			$("#itemTable").datagrid("appendRow",{
				examine_item_id : row.examine_item_id,
				examine_item_name : row.examine_item_name,
				examine_item_price : row.examine_item_price,
				handle : "<a class='del' onclick='' style='cursor: pointer;'>删除</a>"
			});	
		}
	}
	refresh(items);//重新计算
}

//刷新表格删除事件行索引和总费用
function refresh(items){
	var total = 0;//总价
	for (var i = 0; i < items.length; i++) {
		items[i].examine_item_number = i+1;
	}
	$("#itemTable").datagrid('loadData',items);
	//重新遍历表格行数
	for (var i = 0; i < items.length; i++) {
		var price = items[i].examine_item_price;//单价
		total = total + price;//计算总价
		var obj = $(".del");//获取所有删除事件的a标签
		$(obj[i]).attr("onclick","del("+i+",this)");//重新赋值索引行给删除事件
	}
	$("input[name='totalCostText']").val(total.toFixed(2));
}
</script>	
<!-- 单项体检弹框  Start -->
<div class="easyui-window singleWin" title="单项体检项目" style="width:480px;height:400px;user-select:none;"
	data-options="modal:true,collapsible:false,minimizable:false,
	maximizable:false,closed:true,draggable:false,shadow:true,resizable:false" style="padding:20px 40px">
	<div style="background: #dee;padding: 5px;">
		<input id="opsNameSear" class="easyui-searchbox" style="width:160px;height:28px;padding-left:5px;">
		<a id="addItem" class="easyui-linkbutton" style="padding:0 5px;margin-left: 30px;" id="opsBtn-ok">添加</a>
	</div>
	<table id="singleTable" class="easyui-datagrid" style="height:260px" >
	     
	</table> 
</div>
<!-- 单项体检弹框  End-->

<!-- 套餐列表弹框  Start -->
<div class="easyui-window comboWin" title="套餐列表" style="width:480px;user-select:none;"
	data-options="modal:true,collapsible:false,minimizable:false,
	maximizable:false,closed:true,draggable:false,shadow:true,resizable:false" style="padding:20px 40px">
	<table id="comboTable" class="easyui-datagrid" style="height:300px" >
	    <thead>  
	        <tr>
	        	<th data-options="field:'combo_id',width:100,halign:'center'">套餐编号</th>   
	            <th data-options="field:'combo_name',width:250,halign:'center'">套餐名称</th>  
	            <th data-options="field:'combo_price',width:100,halign:'center'">套餐费用</th>
	        </tr>   
	    </thead>  
	</table> 
	<div style="background: #dee;padding: 10px;">
		<a id="comboAdd" iconCls="icon-ok2" class="easyui-linkbutton" style="padding:0 5px;margin-left: 230px;" id="opsBtn-ok">确定</a>
		<a id="comboCancel" iconCls="icon-cancel2" class="easyui-linkbutton" style="padding:0 5px;margin-left: 30px;" id="opsBtn-ok">取消</a>
	</div>
</div>
<!-- 套餐列表弹框  End-->

<div style="overflow: auto;width: 1000px;margin: 5px auto;">
	<fieldset style="margin-bottom: 10px;margin-left: 2px;display:inline-block;float:left; border-radius: 5px;border: 1px solid darkseagreen;width: 950px;">
		<legend>个人信息</legend>
		<form method="post" id="exForm">
		<p>
			<label style="display:inlink-block;margin-left: 20px;"></label>
			<input name="mc.patientName" class="easyui-textbox" required="required" 
				data-options="label:'姓名：',labelAlign:'right',validType:'isNull'" 
				style="height:28px;padding-left:5px;">
			<label style="display:inlink-block;display: inline-block;margin-left: 20px;"></label>
			<select name="mc.patientSex" class="easyui-combobox" 
				panelHeight='auto' data-options="label:'性别：',labelAlign:'right',width:160,editable:false">
				<option value="男">男</option>
				<option value="女" >女</option>
			</select>
			<label style="display:inlink-block;display: inline-block;margin-left: 20px;"></label>
			<input name="mc.patientAge" class="easyui-numberbox" required="required"
				data-options="label:'年龄：',labelAlign:'right'" 
				style="height:28px;padding-left:5px;">
			<label style="display:inlink-block;display: inline-block;margin-left: 20px;"></label>
			<input name="mc.mzcardPhone" class="easyui-numberbox" required="required" 
				data-options="label:'手机：',labelAlign:'right',validType:'phoneNum'" 
				style="width:220px;height:28px;padding-left:5px; ">
		</p>
		<p>
			<label style="display:inlink-block;display: inline-block;margin-left: 20px;"></label>
			<input name="mc.cardCid" class="easyui-textbox" required="required" 
				data-options="label:'身份证号：',labelAlign:'right',validType:'cidNum'" 
				style="width:280px;height:28px;padding-left:5px;">
			<label style="display:inlink-block;display: inline-block;margin-left: 60px;"></label>
			<input name="mc.homeAddress" class="easyui-textbox" required="required" 
				data-options="label:'家庭住址：',labelAlign:'right',validType:'isNull'" 
				style="width:480px;height:28px;padding-left:5px;">
		</p>
		</form>
    </fieldset>
   
	<fieldset class="exItem" style="border-radius: 5px;border: 1px solid darkseagreen;width: 950px;display: inline-block;float: left;">
		<legend>体检项目</legend>
		<p style="border: 1px solid #ddd;padding: 3px 0px;padding-left: 30px;margin: 0;margin-bottom: 6px;">
			<span style="display: inline-block;">
				体检套餐：<input name="comboText" class="text-css" disabled="disabled" style="height: 18px;width: 100px;padding: 0 15px;">
				<input name="combo_id" type="hidden" >
			</span>
			<span style="display: inline-block;margin-left: 30px;">
				套餐价格：<input name="comboPriceText" class="text-css" style="font-size: 15px;height: 18px;width: 55px;padding-left: 10px;" disabled="disabled">
			</span>
			<span style="display: inline-block;margin-left: 30px;">
				总费用：<input name="totalCostText" class="text-css" disabled="disabled" style="font-size: 15px;height: 18px;width: 55px;padding-left: 10px;color: red;">
			</span>
			<a id="comboBtn" class="easyui-linkbutton" style="padding:0 5px;margin: 5px;margin-left: 30px;">体检套餐</a>
			<a id="singleBtn" class="easyui-linkbutton" style="padding:0 5px;margin: 5px;">增加项目</a>
			<a id="exOkBtn" class="easyui-linkbutton" iconCls="icon-save" style="padding:0 5px;margin: 5px;margin-left: 40px;">提交登记</a>
		</p>
		<table class="easyui-datagrid" id="itemTable"  style="height:210px;"
					data-options="singleSelect:true">
			
		</table>
	</fieldset>
</div>
</body>
</html>